<template>
  <div class="share">
    <div class="share_link">
      <div class="share_link_icon copy" @click="CopyUrl">
         <img src="../../assets/images/pubilc/ico_fuzhilianjie@2x.png" alt />
        <p>复制链接</p>
      </div>
      <div class="share_link_icon" id="copys" @click="getWord">
        <img src="../../assets/images/pubilc/ico_taokouling@2x.png" alt />
        <p>淘口令</p>
      </div>
    </div>
    <div class="cancel" @click="cancel">取消</div>
  </div>
</template>

<script>
import { goodsShare, getPassword } from "../../api/index";
import { Toast } from "vant";
import Clipboard from 'clipboard'
export default {
  data() {
    return {
      Url2: "",
      word: ""
    };
  },
  created() {
    this.share();
    this.getPassword(1)
  },
  methods: {
    cancel() {
      this.$emit("cancel", false);
    },
    //分享商品链接
    share() {
      let item = {};
      item.goods_id = this.$route.query.goodsId;
      goodsShare(item).then(res => {
        this.Url2 = res.data.link;
      });
      return this.Url2
    },
    //  淘口令
    getPassword(i) {
      let item = {};
      item.goods_id = this.$route.query.goodsId
      if (i) {
        getPassword(item).then(iten => {
          this.word = iten.data;
          // this.copyPassword()
        })
      } else {
        if(!this.word) {
          getPassword(item).then(iten => {
            this.word = iten.data;
            this.copyPassword()
          }, err => {
            if (err.code === 50000 || err.code === 50107 || err.code === 50108 || err.code === 50113) {
              this.$emit('needlogin', true)
            }
            this.cancel();
          });
        } else {
          this.copyPassword()
        }
      }
    },
    CopyUrl(data) {
      var clipboard = new Clipboard('.copy',{
				text : () => {
					return this.share();
				}
			})
			clipboard.on('success', e => {
        Toast('复制成功')
				// 释放内存
				clipboard.destroy()
			})
			clipboard.on('error', e => {
				// 不支持复制
				Toast('该浏览器不支持自动复制，请手动选择复制。')
				// 释放内存
				clipboard.destroy()
			})
      this.cancel();
    },
    getWord() {
      this.getPassword();
     
    },
    copyPassword () {
      var clipboard = new Clipboard('#copys',{
        text : () => {
          return this.word
        }
      })
      clipboard.on('success', e => {
        Toast('复制成功')
        // 释放内存
        clipboard.destroy()
        // this.cancel();
      })
      clipboard.on('error', e => {
        // 不支持复制
        Toast('该浏览器不支持自动复制，请手动选择复制。')
        // 释放内存
        clipboard.destroy()
      })
      this.cancel();

    }
  }
};
</script>

<style lang="scss" scoped>
.share {
  height: 185px;
  width: 100%;
  .share_link {
    height: 122px;
    background: rgba(243, 243, 243, 1);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    .share_link_icon {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      margin-left: 17px;
      .share_link_icon:nth-child(1) {
        margin-left: 17px;
      }
      img {
        height: 55px;
        width: 55px;
      }
      p {
        font-size: 12px;
        font-weight: blod;
        color: #999;
        margin-top: 10px;
      }
    }
  }
  .cancel {
    font-size: 15px;
    color: rgba(47, 47, 47, 1);
    text-align: center;
    margin-top: 17px;
  }
}
</style>
